import React from 'react'
import { useNavigate } from 'react-router-dom'
import { Button } from 'antd';
import './css/login.scss'
import axios from 'axios';
import {  message } from 'antd';
export default function Login2() {
      let navigate = useNavigate()
      let [phone, setPhone] = React.useState('')
      let [password, setPassword] = React.useState('')
      const [messageApi, contextHolder] = message.useMessage();

      let dl= async() => {
          let {data}=await axios.post('http://localhost:3000/users/user', { phone, password })
          console.log(data);
          if(data.code===200){
            // messageApi.open({
            //     type: 'success',
            //     content: data.msg,
            //   });
            sessionStorage.user=JSON.stringify(data.data)
            sessionStorage.userid=JSON.stringify(data.data._id)
            sessionStorage.token=data.token 
              navigate('/app/home')
          }else if (data.code===403) {
            messageApi.open({
                type: 'warning',
                content: data.msg,
              });
          }else{
            messageApi.open({
                type: 'error',
                content: data.msg,
              });
             
          }
      }
  return (
    <div id='login2'>
        {contextHolder}
       {/* 头部 */}
       <div className='header'>
        <div onClick={()=>{navigate('/login')}}>
          X
        </div>
        <div style={{ fontSize: '15px' }} onClick={()=>{navigate('/login')}}>
          免密登录
        </div>
      </div>
      {/* 登录方式 */}
      <div style={{ height: '7vh' }}></div>
      <div className='login-way' style={{ lineHeight: '3vh', fontSize: '3vh' }}>
        密码登录
      </div>
      <div style={{ height: '5vh' }}></div>
      {/* 登录 */}
      <div className='dl'>
        <input type="text" value={phone} onChange={(e) => { setPhone(e.target.value) }} placeholder='请输入手机号' />
      </div>
      <div className='dl'>
        <input type="password"  value={password} onChange={(e)=>{setPassword(e.target.value)}} placeholder='请输入密码' />
      </div>
      {/* 获取验证码 */}
      <div style={{height:'2vh'}}></div>
      <div style={{ width: '82%', margin: '0 auto'}}>
        <Button type="primary" onClick={dl} style={{ fontSize:'20px',lineHeight:'20px',height:'50px'}} block>
          登录
        </Button>
      </div>
      {/* 底部 */}
      <div style={{textAlign:'center',position:'absolute',bottom:'1vh',width:'100%'}}>
        <div style={{textAlign:'center',width:'100%'}}>
        注册即代表你同意<span style={{ color: '#007fff' }} >《用户协议》</span>和 <span style={{ color: '#007fff' }} >《隐私保护指引》</span>
        </div>
      </div>
    </div>
  )
}
